<!DOCTYPE html>
<html lang="en">
<?php
include('./db/conn.php');
?>
<head>
    <title><?php echo $pageTitle; ?></title>
    <link rel="stylesheet" href="https://cdn.staticfile.net/twitter-bootstrap/5.1.1/css/bootstrap.min.css">
    <style>
        .navbar-brand {
            font-size: 24px;
        }

        .nav-link {
            font-size: 18px;
        }

        .nav-item {
            margin-right: 10px;
        }

        .logout-link {
            margin: auto;
            font-size: 14px;
            color: white;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .admin-link {
            font-size: 18px;
            margin-right: 10px;
        }

        .navbar {
            margin-bottom: 20px;
        }

        .collapse {
            justify-content: flex-end;
        }

        .container {
            margin: 0 auto;
            padding: 20px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

        .avatar {
            border-radius: 50%;
        }
    </style>
</head>

<body>
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
        <div class="container">
            <a class="navbar-brand" href="#">云端课堂·在线教育平台</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav ml-auto">
                    <li class="nav-item">
                        <a class="nav-link">首页</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link">记忆卡片</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link">AI助学</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">番茄钟</a>
                    </li>
                    <?php if (!isset($_COOKIE['user_id'])) : ?>
                        <li class="nav-item">
                            <a class="nav-link" href="./register.php">注册</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="./login.php">登录</a>
                        </li>
                    <?php else : ?>
                        <li class="nav-item">
                            <a class="nav-link" href="./user-center.php">个人中心</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="./user-center.php">
                                <?php
                                $user_id = $_COOKIE['user_id'];
                                $sql = "SELECT * FROM user WHERE user_id=$user_id";
                                $result = $conn->query($sql);
                                $user = $result->fetch_assoc();
                                $avatar = $user['src'];
                                ?>
                                <img src="<?php echo $avatar; ?>" width=50px height=50px id="avatar" class="avatar">
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link logout-link" href="./logout.php">退出登录</a>
                        </li>
                    <?php endif; ?>
                </ul>
            </div>
        </div>
    </nav>
</body>

<script>
    document.getElementsByClassName("navbar-brand")[0].onclick = function() {
        window.location.href = "search.php";
    }
    document.getElementsByClassName("nav-item")[0].onclick = function() {
        window.location.href = "search.php";
    }
    document.getElementsByClassName("nav-item")[1].onclick = function() {
        window.open('http://47.121.116.14:8083/main/user-index.php');
    }
    document.getElementsByClassName("nav-item")[2].onclick = function() {
        window.location.href = "ai.php";
    }
    document.getElementsByClassName("nav-item")[3].onclick = function() {
        window.location.href = "fanqie.php";
    }
</script>

</html>